import React from 'react';
import { Button, Result } from 'antd';
import { ExclamationCircleOutlined } from '@ant-design/icons'
import { useNavigate } from 'react-router-dom';
import './notFound.css'

const NotFound: React.FC = () => {
  const navigate = useNavigate();
  
  return (
    <div className='notFound-root'>
        <Result
            icon={<ExclamationCircleOutlined style={{ color: '#0958d9' }}/>}
            title="404"
            subTitle="抱歉，您访问的页面不存在"
            extra={
                <Button type="primary" onClick={() => navigate('/')}>
                    返回首页
                </Button>
            }
        />
    </div>
  );
};

export default NotFound;
